<template>
	<view>
		<UserInfoCard></UserInfoCard>
		<view class='page-container'>

			<template v-if="rawData && rawData.length">
				<InfoSheet v-for="(sheetData, idx) in sheetDataList" :key="idx" :sheet-data="sheetData"></InfoSheet>
			</template>
			<u-empty v-else text="暂无数据" mode="favor" style="margin-top: 100rpx;"></u-empty>
			<view class="apply-btn">
				在线办理出生证
			</view>
		</view>
	</view>
</template>

<script>
	import UserInfoCard from '../../../components/UserInfo/UserInfoCard.vue'
	import FilterButton from '../../../components/FilterButton/FilterButton.vue'
	export default {
		components: {
			UserInfoCard,
			FilterButton
		},
		computed: {
			sheetDataList() {
				return this.transformData(this.rawData);
			}
		},
		data() {
			return {
				isRecord: true,
				activeDate: '1m',
				selectedTimeRange: '请选择时间范围',
				rawData: [{
					sheetTitle: '新生儿信息',
					status: 0,
					patientName: '杨一帆',
					patientSex: '女',
					momName: '艾芳',
					applyTime: '2025-06-28',
				}, ],
			}
		},
		methods: {
			handleChangeFilterBtn(value) {
				this.activeDate = value;
				this.selectedTimeRange = '请选择时间范围'
			},
			handleChangeTimeRange({
				startDate,
				endDate
			}) {
				this.selectedTimeRange = `${startDate} 至 ${endDate}`;
				this.activeDate = 'all'
			},
			// 数据转换方法
			transformData(rawData) {
				return rawData.map(item => ({
					sheetTitle: item.sheetTitle || '',
					status: item.status || '',
					statusValue: item.status == 0 ? '待审核' : item.status == 1 ? '已审核' : '',
					lineBtn: item.status == 0 ? '' : item.status == 1 ? '' : '',
					coverBtn: '查看详情',
					money: '',
					fields: [{
							label: '新生儿姓名',
							value: item.patientName,
							isNewChild: true
						},
						{
							label: '性别',
							value: item.patientSex
						},
						{
							label: '母亲姓名',
							value: item.momName
						},
						{
							label: '申请时间',
							value: item.applyTime
						},
					]
				}));
			},
			// 检查日期是否在最近 N 个月内
			isWithinMonths(targetDate, nowDate, months) {
				const pastDate = new Date(nowDate);
				pastDate.setMonth(pastDate.getMonth() - months);
				return targetDate >= pastDate && targetDate <= nowDate;
			},
		}
	}
</script>

<style lang='scss' scoped>
	.page-container {
		/* background: linear-gradient(#e0f3ff 0%, #fff 30%); */
		/* min-height: 100vh; */
		padding: 0 16rpx;
	}

	.apply-btn {
		margin: 40rpx auto;
		width: 90%;
		max-width: 600rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		background-color: #1ec6e6;
		color: #fff;
		font-size: 32rpx;
		border-radius: 40rpx;
	}
</style>